<template>
  <div class="total-advantage-box">
    <dv-conical-column-chart :config="config" style="width:100%;height:17vh;" />
  </div>
</template>

<script>
export default {
  props: {
    data: {
      type: Array,
      default() {
        return []
      }
    },
    type: {
      type: String,
      default() {
        return ""
      }
    }
  },
  data() {
    return {
      config: {
        data: [
          // {
          //   name: '2016',
          //   value: 55
          // },
          // {
          //   name: '2017',
          //   value: 120
          // },
          // {
          //   name: '2018',
          //   value: 71
          // },
          // {
          //   name: '2019',
          //   value: 66
          // },
          // {
          //   name: '2020',
          //   value: 80
          // }
        ],
        fontSize: 7,
        showValue: true
      }
    }
  },
  watch: {
    data(val) {
      for (let i = 0; i < val.length; i++) {
        if (this.type === "industryTrend") {
          this.config.data.push({
            name: val[i].date_year,
            value: val[i].num
          })
        }
        if (this.type === "industryThree") {
          this.config.data.push({
            name: val[i].industry,
            value: val[i].val1
          })
        }
      }
      this.config = { ...this.config }
    }
  },
  created() {
    //
  }
}
</script>

<style lang="scss" scoped>
.total-advantage-box {
  padding: 0 1rem;
}
</style>
